<template>
	<view>
		
		<div class="addplace" v-if='addp'>
			<div class="btn" @click="addplace">{{addobj.lat?'重新选择消毒点':'添加消毒点'}}</div>
			
			<div v-if='addobj.lat' style="text-align: center;">
				当前选择 <br> 
				纬度{{addobj.lng}} <br> 
				精度{{addobj.lat}}
			</div>
			
			<div class="addinfo" v-if='addobj.lat'>
				<div class="title">选择地点LOGO</div>
				<div class="selpic" @click="selpic">
					<image class="selpic-m" v-if="!addobj.picurl" src="cloud://xiaodule-ouazr.7869-xiaodule-ouazr-1251611099/uppic.png" mode="widthFix"></image>
					<image class="selpic-m" v-else :src="addobj.picurl" mode="aspectFill"></image>
					
				</div>
				<div class="title">输入地点名称</div>
				<input class="hin" type="text" v-model="addobj.name" placeholder="如: 喜羊羊蛋糕房" />
				<div class="zw" style="height: 40rpx;"></div>
				<div class="btn" @click="sendadd">发布消毒地点</div>
			</div>
			
			
		</div>
		
		<div class="selplace" v-else>
			
			<picker @change="bindPickerChange" :value="index" :range="array">
				
				<div class="btn" >{{selplace.name?"当前选择:"+selplace.name: "选择地点"}}</div>
			</picker>
			
			<div class="addinfo" >
				<div class="title">选择消毒过程照片</div>
				<div class="selpic" @click="selpic">
					<image class="selpic-m" v-if="!sendobj.picurl" src="cloud://xiaodule-ouazr.7869-xiaodule-ouazr-1251611099/uppic.png" mode="widthFix"></image>
					<image class="selpic-m" v-else :src="sendobj.picurl" mode="aspectFill"></image>
					
				</div>
				<div class="title">消毒人</div>
				<input class="hin" type="text" v-model="sendobj.name"  />
				<div class="zw" style="height: 40rpx;"></div>
				<div class="btn" @click="sendpost">确认已消毒</div>
			</div>
			
			
		</div>
		
		
		
		
			
		
	</view>
</template>

<script>
	const db = wx.cloud.database()
export default {
	data() {
		return {
			placelist:[],
			array: [],
			index: 0,
			selplace:{},
			sendobj:{
				name:'',
				picurl:''
			},addp:false,
			addobj:{
				lat:'',
				lng:'',
				name:'',
				picurl:''
			},user:{
				lat:'',
				lng:''
			}
			
		};
	},
	methods: {
		sendpost(){
			//发布消毒
			let _that=this
			if(this.sendobj.picurl&&this.sendobj.name&&this.selplace.name){
				let data={
					placeid:this.selplace._id,
					placename:this.selplace.name,
					time:new Date().getTime(),
					username:this.sendobj.name,
					picurl:this.sendobj.picurl
				}
				
				// db.collection('disinfect').add({
				//   data: data,
				//   success: function(res) {
				//     uni.showModal({
				//         title: '成功',
				//         content: '消毒日志发送成功',
				//     	showCancel:false
				//     });
				// 	_that.goback()
					
				//   }
				// })
				
				
				wx.cloud.callFunction({
				  name: 'hserve',
				  data: {
					name:'sendpost',
					data:data
				  }
				}).then(res=>{
					console.log(res)
					uni.showModal({
					    title: '成功',
					    content: '消毒日志发送成功',
						showCancel:false
					});
					_that.goback()
				})
				
				
				// db.collection('disinfect').update({
				//   data: {
				// 	  list:_.unshift(data)
				//   },
				//   success: function(res) {
				//     uni.showModal({
				//         title: '成功',
				//         content: '消毒日志发送成功',
				//     	showCancel:false
				//     });
				// 	_that.goback()
				//   }
				// })
				
				
			}else{
				uni.showModal({
				    title: '提示',
				    content: '请填写完整信息',
					showCancel:false
				});
			}
			
			
			
		},
		bindPickerChange(a){
			
			this.index=a.detail.value
			
			this.selplace=this.placelist[this.index]
			console.log(this.selplace)
		},
		addplace(){
			let _that=this
			uni.chooseLocation({
			    success: function (res) {
					_that.addobj.lat=res.latitude
					_that.addobj.lng=res.longitude
					console.log(res)
			        console.log('位置名称：' + res.name);
			        console.log('详细地址：' + res.address);
			        console.log('纬度：' + res.latitude);
			        console.log('经度：' + res.longitude);
			    }
			})
		},selpic(){
			let _that=this
			uni.chooseImage({
			    count: 1, //默认9
			    sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
			    success: function (res) {
			        console.log(res.tempFilePaths[0]);
					
					 wx.cloud.uploadFile({
					      // 指定上传到的云路径
					      cloudPath: 'logo/'+new Date().getTime()+(""+Math.ceil(Math.random()*100))+'.jpg',
					      // 指定要上传的文件的小程序临时文件路径
					      filePath: res.tempFilePaths[0],
					      // 成功回调
					      success: res => {
					        console.log('上传成功', res.fileID)
							if(_that.addp){
								//添加地点
								_that.addobj.picurl=res.fileID
							}else{
								//发送
								_that.sendobj.picurl=res.fileID
							}
							
							
							
					      },
					})
			    }
			});
		},sendadd(){
			let _that=this
			if(this.addobj.picurl&&this.addobj.name){
				let data=this.addobj
				let openid=this.$localStorage.getItem('openid')
				db.collection('place').add({
				  data: {
					  lat:data.lat,
					  lng:data.lng,
					  name:data.name,
					  photo:data.picurl,
					  userid:openid,
					  location:db.Geo.Point(data.lng,data.lat),
					  list:[]
				  },
				  success: function(res) {
				    console.log('添加成功',res)
					_that.goback()
					console.log('返回')
				  }
				})
				
				
				
			}else{
				uni.showModal({
				    title: '提示',
				    content: '请填写完整信息',
					showCancel:false
				});
			}
		}
	},onLoad(a) {
		let _that=this
		if(a.id==2){
			this.addp=true
		}
		uni.getLocation({
		    type: 'wgs84',
		    success: function (res) {
		       _that.user.lng=res.longitude
		       _that.user.lat=res.latitude
			   console.log('定位',res)
			   if(a.id==2){
			   	
			   }else{
					//数据库查询
					
					//计算两个精度维度上下限
					
					
					wx.cloud.callFunction({
					  name: 'hserve',
					  data: {
						name:'nearplace',
						lat:_that.user.lat,
						lng:_that.user.lng
					  }
					}).then(res=>{
							let list=res.result.list
							if(list.length==0){
								uni.showModal({
								    title: '提示',
								    content: '附近没有消毒点,请先添加消毒点再填写消毒记录',
									showCancel:false,
									success() {
										_that.goback()
									}
								});
							}else{
								_that.placelist=list
								_that.array=list.map(item=>{
									return item.name
								})
							}
					})
					
			   }
			   
		    }
		});
		
	}
	
};
</script>

<style lang="scss">
	.addinfo{
		text-align: center;
		.selpic{
			width: 400rpx;
			height: 400rpx;
			overflow: hidden;
			margin: 20rpx auto;
			.selpic-m{
				width: 400rpx;
				height: 400rpx;
			}
		}
		.title{
			font-size: 46rpx;
			line-height: 100rpx;
		}
		.hin{
			margin: 40rpx auto;
			width: 600rpx;
			border: 1px solid $maincolor;
			line-height: 200rpx;
			border-radius: 50rpx;
			padding:20rpx 0rpx;
		}
	}
	.btn{
		width: 80%;
		margin: 50rpx auto;
		background-color: $maincolor;
		color: #FFFFFF;
		text-align: center;
		line-height: 100rpx;
		border-radius: 50rpx;
		
	}
	
</style>
